<template>
	<view class="tui-container">
		<view class="tui-login__header">
			<image class="tui-header__img" mode="widthFix" src="/static/images/login/img_login_bg_3x.png"></image>
			<view class="tui-header__inner">
				<!-- #ifndef H5 -->
				<tui-navigation-bar @init="initNavigation">
					<!-- #ifndef MP-ALIPAY || MP-BAIDU -->
					<view class="tui-header__icon" :style="{ marginTop: top + 'px' }">
						<tui-icon name="arrowleft" color="#fff" unit="rpx" :size="68" @click="back"></tui-icon>
					</view>
					<!-- #endif -->
				</tui-navigation-bar>
				<!-- #endif -->
				<view class="tui-header__title" :style="{paddingTop:top+50+'px'}">
					<text class="tui-title__text">登录</text>
					<text class="tui-sub__text">欢迎来到XXXX</text>
				</view>
			</view>
		</view>
		<view class="tui-form__box">
			<image class="tui-login__img" src="/static/images/login/img_login_3x.png" mode="widthFix"></image>
			<view class="tui-form__title">密码登录</view>
			<tui-input name="mobile" v-model="mobile" required maxlength="18" padding="64rpx 0 20rpx" :lineLeft="false" :size="30" placeholder="请输入您的账号">
			</tui-input>
			<tui-input name="u_password" v-model="u_password" required maxlength="20" :password="password" padding="64rpx 0 20rpx" :lineLeft="false" :size="30" placeholder="请输入密码">
				<template v-slot:right>
					<tui-icon unit="rpx" :size="44" @click="change" :name="password?'unseen':'seen'" color="#ccc"></tui-icon>
				</template>
			</tui-input>
			<view class="tui-btn__box">
				<tui-form-button radius="80rpx" @click="login">立即登录</tui-form-button>
			</view>
		</view>
	</view>
</template>

<script>
	import { isNullOrEmpty } from "../../common/common.js"
	export default {
		data() {
			return {
				top: 20,
				password: true,
				mobile: '',
				u_password: '',
			}
		},
		onLoad() {

		},
		methods: {
			initNavigation(e) {
				this.top = e.top;
			},
			back() {
				uni.navigateBack();
			},
			change() {
				this.password = !this.password
			},
			//登录
			login:function(e) {
				var mobile = this.mobile.replace(/\s+/g,'');
				var u_password = this.u_password.replace(/\s+/g,'');
				//校验是否为空
				if(isNullOrEmpty(mobile)){
					 setTimeout(() => {
					 	this.tui.toast('账号不能为空');
					 }, 200);
					 return;
				}
				if(isNullOrEmpty(u_password)){
					 setTimeout(() => {
					 	this.tui.toast('密码不能为空');
					 }, 200);
					 return;
				}
				//console.log('1111111111111')
				// 调用接口测试
				 this.tui.request('/wx/user/h5-login', 'POST', {
					mobile: mobile,  
					password: u_password
				}, false, false,true).then((res) => {
					if (res.code === 200) {
						//let data = res.empinfo;
						//console.log('2222222')
						uni.setStorageSync('token',res.token);
						uni.setStorageSync('empinfo',res.empinfo);
						uni.switchTab({
							url: '/pages/task-list/task-list'
						});
						
					}else{
						this.tui.toast(res.msg)
					}
				}).catch((e) => {}) 
				
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
